<!-- subpkg_consult/department/index.vue -->
<script setup>
	import { computed, ref } from 'vue'
	import { getDepAllAPI } from '@/apis/consult.js'
	const depAll = ref([])
	const activeIndex = ref(0)
	// 获取query参数
	const query = defineProps({
		type: String,
		illnessType: String
	})
	// 获取科室
	const getDepAll = async () => {
		const res = await getDepAllAPI()
		// console.log(res)
		depAll.value = res.data
	}

	getDepAll()
	// 通过计算属性 获取二级科室
	const subDep = computed(() => depAll.value[activeIndex.value]?.child)
</script>

<template>
	<view class="department-page">
		<scroll-view scroll-y class="department-primary">
			<view
				class="department-item"
				v-for="(item, index) in depAll"
				:key="item.id"
				:class="{ active: activeIndex === index }"
				@click="activeIndex = index"
			>
				{{ item.name }}
			</view>
		</scroll-view>
		<scroll-view class="department-secondary">
			<navigator
				hover-class="none"
				:url="`/subpkg_consult/description/index?type=${query.type}&illnessType=${query.illnessType}&depId=${item.id}`"
				class="department-item"
				v-for="item in subDep"
				:key="item.id"
			>
				{{ item.name }}
			</navigator>
		</scroll-view>
	</view>
</template>

<style lang="scss">
	@import './index.scss';
</style>
